<template>
	<div id="OrderInfo">
		<x-header :left-options="{showBack: false}" title="订单详情" class="header">
			<a slot="left" @click="back()"><i class="tp-icon icon-black-back"></i></a>
		</x-header>
		<div class="title-bar" v-bind:style="{'background-image':'url(' + '/los' + '/public/static/images/icon_order_bg.png)'}">
			<div class="wait" v-if="goodsOrder.pay_state == 0 && curTime < auctionOrder.auction_endtime && goodsOrder.order_close == 0 && goodsOrder.order_from == 'auction_signup'">
				<i class="re-icon icon-time"></i>
				<span>等待付款</span>
			</div>
			<div class="wait" v-if="goodsOrder.pay_state == 0 && curTime < auctionOrder.order_time + 86400 && goodsOrder.order_close == 0 && goodsOrder.order_from != 'auction_signup'">
				<i class="re-icon icon-time"></i>
				<span>等待付款</span>
			</div>
			<div class="wait" v-if="goodsOrder.pay_state == 0 && goodsOrder.order_close == 1 ">
				<i class="re-icon icon-time"></i>
				<span>交易关闭</span>
			</div>
			<div class="wait" v-if="goodsOrder.pay_state == 0 && curTime < auctionOrder.auction_endtime && goodsOrder.order_close == 0 && goodsOrder.order_from == 'auction_signup'">
				<i class="re-icon icon-time"></i>
				<span>等待付款</span>
			</div>
			<div class="wait" v-if="goodsOrder.pay_state == 1  && goodsOrder.order_state == 20">
				<i class="re-icon icon-time"></i>
				<span>等待发货</span>
			</div>
			<div class="wait" v-if="goodsOrder.pay_state == 1  && goodsOrder.order_state == 30">
				<i class="re-icon icon-time"></i>
				<span>等待收货</span>
			</div>
			<div class="wait" v-if="goodsOrder.pay_state == 1  && goodsOrder.order_state == 40">
				<i class="re-icon icon-time"></i>
				<span>交易完成</span>
			</div>
			<div class="wait" v-if="goodsOrder.pay_state == 2  && goodsOrder.order_state == 40">
				<i class="re-icon icon-time"></i>
				<span>退款成功</span>
			</div>
			<div class="wait" v-if="goodsOrder.order_state == 35 && goods_return.return_state == null">
				<i class="re-icon icon-time"></i>
				<span>申请退货</span>
			</div>
			<div class="wait" v-if="goods_return.return_state == 1 && goods_return.express_number == null">
				<i class="re-icon icon-time"></i>
				<span>同意退货</span>
			</div>

			<div class="wait" v-if="goods_return.return_state == 1 && goodsOrder.pay_state != 2 && goods_return.express_number != null">
				<i class="re-icon icon-time"></i>
				<span>等待卖家确认</span>
			</div>
			<div class="wait" v-if="goodsOrder.pay_state == 2">
				<i class="re-icon icon-time"></i>
				<span>交易失败</span>
			</div>

			<div class="pay-time" v-if="goodsOrder.pay_state == 0">
				<p v-if="goodsOrder.order_close == 1">失败原因：{{goodsOrder.order_close_cause}}</p>
				<p v-if="goodsOrder.order_close == 1 && goodsOrder.order_from != 'auction_signup'" class="close-order">关闭时间：{{common.timestampToTime(goodsOrder.auction_endtime)}}</p>
				<p v-if="goodsOrder.order_close == 1 && goodsOrder.order_from == 'auction_signup'" class="close-order">关闭时间：{{common.timestampToTime(goodsOrder.order_time + 86400 * 3)}}</p>
				<count-down v-if="goodsOrder.order_from != 'auction_signup'" :currentTime="parseInt(curTime)" :startTime="goodsOrder.order_time" :endTime="goodsOrder.order_time + 86400 * 3" :tipText="'距开始'" :tipTextEnd="'距结束'" :endText="'订单关闭'" :dayTxt="'天'" :hourTxt="'时'" :minutesTxt="'分'" :secondsTxt="'秒'"></count-down>
				<count-down v-else :currentTime="parseInt(curTime)" :startTime="goodsOrder.order_time" :endTime="auctionOrder.auction_endtime" :tipText="'距开始'" :tipTextEnd="'距结束'" :endText="''" :dayTxt="'天'" :hourTxt="'时'" :minutesTxt="'分'" :secondsTxt="'秒'"></count-down>
				<p v-if="goodsOrder.order_close == 0">超时订单自动取消</p>
			</div>
			<div class="pay-time" v-if="goodsOrder.pay_state == 1  && goodsOrder.order_state == 20">
				<count-down :currentTime="parseInt(curTime)" :startTime="goodsOrder.order_time" :endTime="goodsOrder.order_time + 86400 * 7" :tipText="'距开始'" :tipTextEnd="'发货截止'" :endText="'未按时发货 交易关闭'" :dayTxt="'天'" :hourTxt="'时'" :minutesTxt="'分'" :secondsTxt="'秒'"></count-down>
				<p>超时订单自动取消</p>
			</div>
			<div class="pay-time" v-if="goodsOrder.pay_state == 1  && goodsOrder.order_state == 30">
				<count-down :currentTime="parseInt(curTime)" :startTime="auctionOrder.express_time" :endTime="sign_time" :tipText="'距开始'" :tipTextEnd="'距自动签收'" :endText="'未按时发货 交易关闭'" :dayTxt="'天'" :hourTxt="'时'" :minutesTxt="'分'" :secondsTxt="'秒'"></count-down>
				<p>超时订单自动确认收货</p>
			</div>
			<div class="pay-time" v-if="goodsOrder.order_state == 40">
				<p class="end">感谢您对好文玩拍卖平台的支持</p>
				<p>欢迎您再次光临！</p>
			</div>

			<div class="pay-time" v-if="goodsOrder.order_state == 35 && goods_return.return_state == null">
				<p class="end">退款金额：￥{{goods_return.return_money}}</p>
				<p>申请时间：{{common.timestampToTime(goods_return.return_starttime)}}</p>
			</div>
			<div v-if="goods_return.return_state == 1 && goods_return.express_number == null" class="pay-time">
				<p class="end">退款金额：￥{{goods_return.return_money}}</p>
				<count-down :currentTime="parseInt(curTime)" :startTime="goods_return.return_starttime" :endTime="goods_return.return_starttime + 86400 * 7" :tipText="'距开始'" :tipTextEnd="'距结束'" :endText="'订单关闭'" :dayTxt="'天'" :hourTxt="'时'" :minutesTxt="'分'" :secondsTxt="'秒'" class="timer"></count-down>
			</div>
			<div class="pay-time" v-if="goods_return.return_state == 1 && goodsOrder.pay_state != 2 && goods_return.express_number != null">
				<p class="end">退款金额：￥{{goods_return.return_money}}</p>
				<p>退货时间：{{common.timestampToTime(goods_return.express_time)}}</p>
			</div>
			<div class="pay-time" v-if="goodsOrder.pay_state == 2">
				<p class="end">失败原因：买家退款</p>
				<p>失败时间：{{common.timestampToTime(goods_return.return_endtime)}}</p>
			</div>

		</div>
		<router-link :to="'/FlowProgress/order_sn/'+ goodsOrder.order_sn">
			<div class="order-state" v-if="goodsOrder.order_from != 'auction_signup' && goodsOrder.order_state > 20">
				<!--<i class="pm-icon icon-flow"></i>-->
				<img src="../assets/images/home/icon_flow.jpg" alt="" class="flow" />
				<div class="flow-info" v-for="item in deliveryInfo">
					<p class="desc">{{item.context}}</p>
					<p class="timer">{{item.ftime}}</p>
				</div>
				<img src="../assets/images/home/icon_right2.png" alt="" class="right" />
			</div>
		</router-link>
		<div class="street" v-if="goodsOrder.order_from != 'auction_signup' && auctionOrder.pay_state != 0">
			<div class="way">
				<span>收&nbsp;货&nbsp;&nbsp;人 : &nbsp;{{goodsOrder.receiver_name}}</span>
				<b>{{goodsOrder.receiver_tel}}</b>
			</div>
			<div class="block">
				<img src="../assets/images/home/icon_address.png" alt="" />
				<span>收货地址 :</span>
				<p>{{goodsOrder.receiver_province}}{{goodsOrder.receiver_city}}{{goodsOrder.receiver_county}}{{goodsOrder.receiver_address}}
				</p>
			</div>
		</div>
		<div class="shopInfo">
			<div class="sellInfo">
				<img v-if="goodsOrder.shop_id == undefined" src="../assets/images/home/defaultImg.jpg" class="photo" alt="" />
				<img v-else :src="'/los/uploads/thumb/shop/' + goodsOrder.shop_id + '_72X72.jpeg'" class="photo" alt="" />
				<span class="shop_name">{{goodsOrder.shop_name}}</span>
				<img src="../assets/images/home/icon_right.png" class="right" alt="" />
				<div class="contact">
					<a :href="'tel:' + member_mobile">
						<i class="pm-icon icon-tel"></i>
						<span>联系卖家</span>
					</a>
				</div>
			</div>
		</div>
		<div class="buyInfo">
			<div class="pic_bar" v-if="goodsOrder.order_from == 'auction_signup' || goodsOrder.order_from == 'auction_order'">
				<router-link :to="'/Detail/id/' + auctionOrder.auction_id">
					<img :src="'/los' + auctionOrder.goods.goods_thumb" alt="" />
					<div class="right">
						<p>{{auctionOrder.goods.goods_name}}</p>
						<span>消费者保障</span>
						<div class="numWrap">
							<b>￥{{goodsOrder.pay_money}}</b>
						</div>
					</div>
				</router-link>
			</div>

			<div class="pic_bar" v-if="goodsOrder.order_from == 'seckill_order'">
				<router-link :to="'/ZoneDetail/id/' + auctionOrder.seckill_id">
					<img :src="'/los' + auctionOrder.goods.goods_thumb" alt="" />
					<div class="right">
						<p>{{auctionOrder.goods.goods_name}}</p>
						<span>消费者保障</span>
						<div class="numWrap">
							<b>￥{{auctionOrder.seckill_price}}</b>
						</div>
					</div>
				</router-link>
			</div>
		</div>
		<div class="promise">
			<p><span>商品小计</span><b>￥{{goodsOrder.pay_money}}</b></p>
			<p><span>运费</span><b>￥0.00</b></p>
			<p><span style="font-size: 0.37rem;color: #333;">实付款(含运费)</span><b style="font-size: 0.4rem;">￥{{goodsOrder.pay_money}}</b></p>
		</div>
		<div class="promise">
			<p><span>配送方式</span>
				<b v-if="goodsOrder.express_comanay != '上门自取'">快递配送</b>
				<b v-else>上门自取</b>
			</p>
		</div>
		<ul class="order-time" v-if="auctionOrder.pay_state != 0 && goodsOrder.express_number != null && goodsOrder.express_number != ''">
			<li>
				<p><span>快递公司</span><b>{{goodsOrder.express_comanay}}</b></p>
			</li>
			<li>
				<p>
					<span>快递单号</span><b>{{goodsOrder.express_number}}</b>
					<span @click="copy()" class="tag-read" :data-clipboard-text="order_copy">复制</span>
				</p>
			</li>
		</ul>
		<ul class="order-time">
			<li>
				<p>
					<span>订单编号</span><b>{{goodsOrder.order_sn}}</b>
				</p>
			</li>
			<li>
				<p><span>下单时间</span><b>{{common.timestampToTime(goodsOrder.order_time)}}</b></p>
			</li>
		</ul>

		<div class="return-cause" v-if="goodsOrder.order_state == 35 || goodsOrder.order_state == 36">
			<h2 class="vux-1px-b">售后信息 <span>{{return_time}}</span></h2>
			<div class="desc">买家-{{goods_return.return_cause}}</div>
		</div>
		<div class="return-address" v-if="goodsOrder.order_state == 36">
			<h2 class="vux-1px-b">商家退货地址</h2>
			<div class="info">
				<p class="receive-name">收货人：{{goods_return.receiver_name}} <span>{{goods_return.receiver_tel}}</span></p>
				<p class="receive-add">{{goods_return.receiver_province}}{{goods_return.receiver_city}}{{goods_return.receiver_county}}{{goods_return.receiver_address}}</p>
			</div>
		</div>

		<div class="pay" v-if="goodsOrder.order_state == 20 && goodsOrder.order_from == 'auction_order' ">
			<b @click="warn(goodsOrder.order_sn)">提醒发货</b>
		</div>
		<div class="pay" v-if="goodsOrder.order_state == 20 && goodsOrder.order_from == 'seckill_order' ">
			<b @click="warnSeckill(goodsOrder.order_sn)">提醒发货</b>
		</div>
		<div class="pay" v-if="goodsOrder.order_state == 30">
			<router-link :to="'/FlowProgress/order_sn/'+ goodsOrder.order_sn">
				<b v-if="goodsOrder.express_comanay != '上门自取'">查看物流</b>
			</router-link>
			<b @click="orderSign(goodsOrder.order_sn)">确认收货</b>
			<b v-if="curTime + 86400 * 7 > auctionOrder.sign_time" @click="extendFlow(goodsOrder.order_sn,goodsOrder.order_from)">延长收货</b>
			<router-link :to="'/ClientReturn/order_sn/' + goodsOrder.order_sn">
				<b>申请售后</b>
			</router-link>
		</div>
		<div class="pay" v-if="(goodsOrder.order_state == 35 || goodsOrder.order_state == 36) && goodsOrder.pay_state != 2 ">
			<b @click="orderSign(goodsOrder.order_sn)">确认收货</b>
		</div>
		<!--<div class="pay" v-if="goodsOrder.pay_state == 2 ">
			<b class="del">删除订单</b>
		</div>-->

		<div class="pay" v-if="goodsOrder.pay_state == 0  && goodsOrder.order_close == 0">
			<!--保证金支付-->
			<b v-if="goodsOrder.order_from == 'auction_signup' && curTime < auctionOrder.auction_endtime" @click="signup_pay(auctionOrder.auction_id)">支付订单</b>
			<!--秒杀支付-->
			<b v-if="goodsOrder.order_from == 'seckill_order'  && curTime < goodsOrder.order_time + 86400 * 3" @click="skill_pay(auctionOrder.seckill_id)">支付订单</b>
			<!--拍品支付-->
			<b v-if="goodsOrder.order_from == 'auction_order' && curTime < goodsOrder.order_time + 86400 * 3" @click="auction_pay(auctionOrder.order_sn)">支付订单</b>
		</div>

		<div class="pay" v-if="goods_return.return_state == 1 && goods_return.express_number == null">
			<router-link :to="'/ClientReturnFlow/return_sn/' + return_sn">
				<b>立即退货</b>
			</router-link>
			<b @click="orderSign(goodsOrder.order_sn)">确认收货</b>
		</div>
		<toast v-model="success" type="text" width='5rem' is-show-mask>{{msg}}</toast>
	</div>
</template>

<script>
	import { XHeader, Toast } from "vux";
	import Clipboard from 'clipboard';
	import CountDown from "vue2-countdown";
	export default {
		data() {
			return {
				goodsOrder: '',
				auctionOrder: '',
				curTime: '',
				order_copy: '',
				success: false,
				flag: true,
				goods_return: {},
				msg: '',
				member_mobile: '',
				deliveryInfo: [],
				return_sn: '',
				return_time: '',
				sign_time: ''
			};
		},
		components: {
			XHeader,
			CountDown,
			Toast
		},
		mounted() {
			this.getOrderInfo();
			if(this.$route.query.return_sn) {
				this.return_sn = this.$route.query.return_sn;
				this.getReturnRecord();
			}
		},
		beforeRouteLeave(to, from, next) {
			console.log(to.name);
			if(to.name == 'Detail') {
				from.meta.keepAlive = true; // 跳转到 详情页时，店铺页面缓存，即不刷新
			} else {
				from.meta.keepAlive = false;
			}
			next();
		},
		methods: {
			getOrderInfo: function() {
				let order_sn = this.$route.params.order_sn;
				this.$http({
					method: 'GET',
					url: '/los/api/member/goods_order_info.json?order_sn=' + order_sn,
					data: ''
				}).then((result) => {
					this.goodsOrder = result.data.goods_order;
					if(this.goodsOrder.order_state > 20) {
						this.getDeliveryCode(this.goodsOrder.express_number);
					}
					if(result.data.auction_order) {
						this.auctionOrder = result.data.auction_order;
						this.sign_time = this.auctionOrder.sign_time;
						if(this.sign_time < this.auctionOrder.express_time + 86400 * 7) {
							this.sign_time = this.auctionOrder.express_time + 86400 * 7;
						}
					} else if(result.data.seckill_order) {
						this.auctionOrder = result.data.seckill_order;
					} else if(result.data.auction_signup) {
						this.auctionOrder = result.data.auction_signup;
					}
					this.member_mobile = this.auctionOrder.shop.member.member_mobile;
					this.order_copy = this.goodsOrder.express_number;
					this.curTime = result.data.cur_time;
				}).catch((err) => {

				})
			},
			//根据订单数据生成支付数据   拍品
			auction_pay: function(order_sn) {
				var params = {
					order_sn: order_sn
				}
				this.$http({
					method: 'POST',
					url: '/los/api/wxpay/auction_order',
					data: params
				}).then((result) => {
					console.log(result);
					if(result.data.code == 1) {
						location.href = '#/PaymentPage/id/' + result.data.data.pay_sn
					}
				}).catch((err) => {
					console.log(err);
				})
			},
			//保证金支付
			signup_pay: function(auction_id) {
				var params = {
					auction_id: auction_id
				}
				this.$http({
					method: 'POST',
					url: '/los/api/auction/signup_pay.json',
					data: params
				}).then((result) => {
					console.log(result);
					this.shopInfo = result.data.data;
					this.show1 = false;
					if(result.data.code == 1) {
						this.$http({
							method: 'POST',
							url: '/los' + result.data.url,
							data: ''
						}).then((rst) => {
							if(rst.data.code == 1) {
								location.href = '#/PaymentPage/id/' + rst.data.data.pay_sn;
							}
						}).catch((err) => {
							console.log(err);
						})
					} else {
						this.success = !this.success;
						this.msg = result.data.msg;
					}
				}).catch((err) => {
					console.log(err);
				})
			},
			//秒杀支付
			skill_pay: function(seckill_id) {
				var params = {
					seckill_id: seckill_id,
				}
				this.$http({
					method: 'POST',
					url: '/los/api/seckill/goods_buy.json',
					data: params
				}).then((result) => {
					console.log(result);
					if(result.data.code == 1) {
						this.success = !this.success;
						this.msg = result.data.msg;
						this.$http({
							method: 'POST',
							url: '/los' + result.data.url,
							data: ''
						}).then((rst) => {
							if(rst.data.code == 1) {
								location.href = '#/PaymentPage/id/' + rst.data.data.pay_sn;
							}
						}).catch((err) => {

						})
					}
				}).catch((err) => {
					console.log(err);
				})
			},

			//退款记录
			getReturnRecord: function() {
				this.$http({
					method: 'GET',
					url: '/los/api/buyer/goods_return_details.json?return_sn=' + this.return_sn,
					data: ''
				}).then((result) => {
					this.goods_return = result.data.data.goods_return;
					this.return_time = this.goods_return.add_time.substring(5);
				}).catch((err) => {

				})
			},

			//复制订单链接
			copy() {
				var _this = this;
				var clipboard = new Clipboard('.tag-read');
				clipboard.on('success', function(e) {
					_this.success = !_this.success;
					_this.msg = '复制成功';
				})
				clipboard.on('error', e => {
					_this.success = !_this.success;
					_this.msg = '该浏览器不支持自动复制';
					clipboard.destroy();
				})
			},

			//秒杀提醒发货
			warnSeckill: function(order_sn) {
				var params = {
					order_sn: order_sn
				}
				this.$http({
					method: 'POST',
					url: '/los/api/seckill/order_notice.json',
					data: params
				}).then((result) => {
					console.log(result);
					this.success = !this.success;
					this.msg = '提醒成功';
					this.$nextTick(() => {
						this.getOrderInfo();
					})
				}).catch((err) => {
					console.log(err);
				})
			},
			//提醒发货
			warn: function(order_sn) {
				var params = {
					order_sn: order_sn
				}
				this.$http({
					method: 'POST',
					url: '/los/api/auction/order_notice.json',
					data: params
				}).then((result) => {
					console.log(result);
					this.success = !this.success;
					this.msg = '提醒成功';
					this.$nextTick(() => {
						this.getOrderInfo();
					})
				}).catch((err) => {
					console.log(err);
				})
			},

			//延长物流
			extendFlow: function(order_sn, order_from) {
				var params = {
					order_sn: order_sn,
					order_from: order_from
				}
				this.$http({
					method: 'POST',
					url: '/los/api/buyer/order_sign_retime.json',
					data: params
				}).then((result) => {
					this.success = !this.success;
					this.msg = '申请延长收货成功';
					this.$nextTick(() => {
						this.getOrderInfo();
					})
				}).catch((err) => {
					console.log(err);
				})
			},
			//签收
			orderSign: function(order_sn) {
				var params = {
					order_sn: order_sn
				}
				this.$http({
					method: 'POST',
					url: '/los/api/member/order_sign.json',
					data: params
				}).then((result) => {
					console.log(result);
					this.success = !this.success;
					this.msg = '签收成功';
					this.$nextTick(() => {
						this.getOrderInfo();
					})
				}).catch((err) => {
					console.log(err);
				})
			},
			//物流信息
			getDeliveryCode: function(express_number) {
				this.$http({
					method: 'GET',
					//51119662106831 this.goodsOrder.express_number 3859000136883
					url: '/los/api/test/kd100/?delivery_code=' + express_number
				}).then((result) => {
					if(result.data.data.express_info.status == '200') {
						this.deliveryInfo = result.data.data.express_info.data.slice(0, 1);
					}
				}).catch((err) => {

				})
			},
			back: function() {
				window.history.go(-1);
			},
		}
	};
</script>

<style scoped>
	.header {
		background: #fff;
	}
	
	#OrderInfo {
		position: relative;
		margin-bottom: 2.6rem;
	}
	
	.title-bar {
		width: 100%;
		height: 2.64rem;
		overflow: hidden;
		padding: 0.7rem 0.26rem;
	}
	
	.title-bar .wait {
		float: left;
		margin-top: 0.21rem;
	}
	
	.title-bar .wait span {
		font-size: 0.4rem;
		color: #fff;
	}
	
	.title-bar .pay-time {
		float: right;
		color: #fff;
		text-align: right;
	}
	
	.title-bar .pay-time p {
		font-size: 0.32rem;
	}
	
	.title-bar .pay-time .close-order {
		margin-top: 0.26rem;
	}
	
	.title-bar .pay-time .timer {
		margin-top: 0.29rem;
	}
	
	.title-bar .pay-time p:last-child {
		margin-top: 0.29rem;
	}
	
	.title-bar .pay-time .end {
		display: inline-block;
		font-size: 0.34rem;
		line-height: 1;
		width: 100%;
	}
	
	.street {
		width: 100%;
		margin-top: 0.26rem;
		background: #fff;
		padding: 0.26rem;
		height: 2.66rem;
	}
	
	.street .way {
		overflow: hidden;
		color: #333;
		font-size: 0.37rem;
		margin-top: 0.2rem;
	}
	
	.street .way span {
		float: left;
		display: inline-block;
		margin-left: 0.53rem;
	}
	
	.street .way b {
		float: right;
		font-weight: normal;
	}
	
	.street .block {
		overflow: hidden;
		margin-top: 0.25rem;
	}
	
	.street .block img {
		float: left;
		width: 0.4rem;
		margin-right: 0.14rem;
		margin-top: 0.05rem;
		border-radius: 0.05rem;
	}
	
	.street .block span {
		font-size: 0.37rem;
		float: left;
		line-height: 0.5rem;
	}
	
	.street .block p {
		float: right;
		width: 72%;
		height: 1rem;
		line-height: 0.5rem;
		overflow: hidden;
		font-size: 0.37rem;
	}
	
	.hiden {
		height: 2.7rem;
		width: 100%;
		background: #fff;
	}
	
	.shopInfo {
		background: #fff;
		margin-top: 0.26rem;
	}
	
	.shopInfo .sellInfo {
		height: 1.17rem;
		line-height: 1.17rem;
	}
	
	.shopInfo .sellInfo .photo {
		width: 0.74rem;
		height: 0.74rem;
		margin: 0.21rem 0.26rem;
		float: left;
		border-radius: 0.05rem;
	}
	
	.shopInfo .sellInfo .shop_name {
		height: 1.17rem;
		line-height: 1.17rem;
		display: inline-block;
		font-size: 0.34rem;
		float: left;
	}
	
	.shopInfo .sellInfo .right {
		width: 0.26rem;
		height: 0.26rem;
		line-height: 1.17rem;
		margin: 0.4rem;
		float: left;
	}
	
	.sellInfo .contact {
		width: 2.21rem;
		height: 0.61rem;
		line-height: 0.61rem;
		float: right;
		border-radius: 0.3rem;
		background: #f0f0f0;
		margin: 0.21rem 0.26rem;
		overflow: hidden;
	}
	
	.sellInfo .contact {
		width: 2.21rem;
		height: 0.61rem;
		display: block;
		overflow: hidden;
	}
	
	.sellInfo .contact .icon-tel {
		float: left;
		margin: 0.13rem 0 0.13rem 0.2rem;
	}
	
	.sellInfo .contact span {
		float: right;
		color: #777;
		font-size: 0.32rem;
		margin-right: 0.26rem;
		margin-top: 0.04rem;
	}
	
	.buyInfo {
		padding: 0.26rem;
		position: relative;
		background: #fff;
	}
	
	.buyInfo:before {
		content: " ";
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		height: 1px;
		border-top: 1px solid #e6e6e6;
		color: #e6e6e6;
		transform-origin: 0 0;
		transform: scaleY(0.5);
	}
	
	.buyInfo .pic_bar {
		padding: .4rem 0;
		width: 100%;
		height: 2.8rem;
	}
	
	.buyInfo .pic_bar img {
		width: 2.05rem;
		height: 2.05rem;
		float: left;
		border-radius: .05rem;
	}
	
	.buyInfo .pic_bar .right {
		float: left;
		margin-top: .05rem;
		margin-left: .34rem;
		height: 2rem;
		width: 6.93rem;
		position: relative;
	}
	
	.buyInfo .pic_bar .right p {
		font-size: 0.37rem;
		line-height: 0.5rem;
		color: #333;
		overflow: hidden;
		text-align: left;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	
	.buyInfo .pic_bar .right span {
		float: left;
		font-size: 0.34rem;
		color: #aaa;
		margin-top: 0.2rem;
	}
	
	.buyInfo .pic_bar .right b {
		font-weight: normal;
		color: #DA4240;
		font-size: 0.42rem;
		display: block;
		float: left;
	}
	
	.buyInfo .pic_bar .numWrap {
		float: left;
		width: 80%;
		margin-top: 0.37rem;
	}
	
	.promise {
		color: #333;
		overflow: hidden;
		position: relative;
		background: #fff;
		padding: 0.26rem;
		margin-top: 0.26rem;
	}
	
	.promise p {
		width: 100%;
		height: 0.7rem;
		line-height: 0.7rem;
		color: #777;
	}
	
	.promise p:nth-child(3) b {
		color: #dd2828;
	}
	
	.promise span {
		float: left;
		font-size: 0.34rem;
	}
	
	.promise b {
		float: right;
		font-weight: normal;
		font-size: 0.34rem;
	}
	
	.order-time {
		color: #777;
		overflow: hidden;
		margin-top: 0.26rem;
		background: #fff;
		padding: 0.26rem;
	}
	
	.order-time li {
		width: 100%;
		height: 0.8rem;
		line-height: 0.8rem;
	}
	
	.order-time li p {
		width: 100%;
		height: 0.8rem;
		line-height: 0.8rem;
	}
	
	.order-time:nth-child(2):after {
		border: none;
	}
	
	.order-time:nth-child(3) b {
		color: #dd2828;
	}
	
	.order-time span {
		float: left;
		font-size: 0.34rem;
	}
	
	.order-time b {
		float: left;
		margin-left: 0.26rem;
		font-weight: normal;
		font-size: 0.34rem;
	}
	
	.order-time .tag-read {
		float: right;
		font-style: normal;
		color: #333;
		width: 1.44rem;
		height: 0.53rem;
		line-height: 0.53rem;
		overflow: hidden;
		margin-right: 2.2rem;
		text-align: center;
		display: block;
		border-radius: 1.2rem;
		vertical-align: middle;
		border: solid 1px #ccc;
		margin-top: 0.13rem;
	}
	
	.return-cause {
		padding: 0 0.26rem;
		margin-top: 0.26rem;
		background: #fff;
	}
	
	.return-cause h2 {
		width: 100%;
		height: 1.17rem;
		line-height: 1.17rem;
		font-size: 0.4rem;
		color: #222;
		overflow: hidden;
	}
	
	.return-cause h2 span {
		float: right;
		color: #666;
		font-size: 0.34rem;
	}
	
	.return-cause .desc {
		width: 100%;
		line-height: 0.6rem;
		font-size: 0.37rem;
		color: #666;
		padding: 0.26rem 0;
	}
	
	.pay {
		position: fixed;
		bottom: 0;
		height: 1.3rem;
		background: #fff;
		overflow: hidden;
		width: 100%;
		padding: 0 0.26rem;
		line-height: 1.3rem;
		border-top: solid 1px #f3f3f3;
	}
	
	.pay p {
		float: left;
		font-size: 0.37rem;
	}
	
	.pay p span {
		font-size: 0.34rem;
		color: #dd2828;
	}
	
	.pay b {
		float: right;
		font-weight: normal;
		color: #a30000;
		width: 2rem;
		height: 0.74rem;
		line-height: .74rem;
		text-align: center;
		margin-top: .25rem;
		border-radius: 0.34rem;
		font-size: 0.34rem;
		border: solid 1px #a30000;
		margin-left: 0.26rem;
	}
	
	.order-state {
		background: #fff;
		overflow: hidden;
		padding: 0.48rem 0.26rem;
	}
	
	.order-state .flow {
		float: left;
		margin-right: 0.32rem;
		width: 0.42rem;
		height: 0.42rem;
	}
	
	.order-state .flow-info {
		float: left;
		width: 84%;
	}
	
	.order-state .flow-info .desc {
		font-size: 0.37rem;
		color: #333;
		line-height: 0.56rem;
	}
	
	.order-state .flow-info .timer {
		font-size: 0.34rem;
		color: #777;
		margin-top: 0.34rem;
	}
	
	.order-state .right {
		float: right;
		width: 0.29rem;
		height: 0.37rem;
	}
	
	.return-address {
		margin-top: 0.26rem;
		background: #fff;
		padding: 0 0.26rem;
	}
	
	.return-address h2 {
		height: 1.17rem;
		line-height: 1.17rem;
		font-size: 0.4rem;
		color: #222;
	}
	
	.return-address .receive-name {
		padding-top: 0.4rem;
		color: #666;
		font-size: 0.37rem;
		margin-bottom: 0.13rem;
	}
	
	.return-address .receive-name span {
		margin-left: 0.56rem;
	}
	
	.return-address .receive-add {
		padding-bottom: 0.4rem;
		color: #666;
		font-size: 0.37rem;
	}
</style>